<template>
  <div id="user_info">
    <k-header headTitle="个人资料" goBack="true" rightTitle="保存" @rightClick="oBtn"></k-header>
    <div class="user_info_list" :class="headIos?'side-fixd-ios':'side-fixed'">
      <group>
        <cell title="头像" is-link>
          <span slot="default" >
            <img class="user_info_img" src="../../assets/img/center/user_info_tp.png" v-if="headphoto" />
            <img class="user_info_img" :src="cercompany.facePhoto" v-else/>
          </span>
        </cell>
        <cell title="姓名" class="user_info_names" >
          <input class="user_info_name" type="text" name="" v-model="names" />
        </cell>
        <popup-picker
          title="性别"
          :data="plainList"
          @on-change="onChange"
          confirm-text="确定"
          v-model= 'sex'
        />
      </group>
      <!-- :placeholder= "(cercompany.sex == 'MALE')? '男':(cercompany.sex == 'FEMALE')? '女' :(cercompany.sex == 'SECRECY')?'保密':''" -->
      <div class="occpinfor" v-if='occp'>
        <div class="user_info_work">职业信息</div>
        <group>
          <cell title="我的职位" class="user_info_names">
            <input class="user_info_name user_info_make" type="text" readonly name="" :value="cercompany.posiTion">
          </cell>
          <cell title="当前公司" class="user_info_names">
            <input class="user_info_name user_info_make" type="text" readonly name="" :value="cercompany.companyInfoFullName">
          </cell>
        </group>
      </div>
    </div>
    <toast v-model="showPositionValue" type="text" width="100%" :time="1800" is-show-mask :text="message" position="bottom"></toast>
  </div>
</template>

<script>
  import kHeader from '../common/head'
  import { Cell, Group, Selector, PopupPicker, Picker, Divider, XSwitch, XButton } from 'vux'
  import { TransferDomDirective as TransferDom, Toast } from 'vux'
  import util from '../../libs/util'
  export default {
    name: 'hello',
    directives: {
      TransferDom
    },
    data () {
      return {
        show: false,
        userName: '赵先生',
        isType: false,
        sex: [],
        plainList: [['男', '女', '保密']],
        cercompany: '',
        headphoto: true,
        occp: false,
        names: '',
        message: '',
        showPositionValue: false,
        headIos: false
      }
    },
    components: {
      kHeader,
      Cell,
      Group,
      Selector,
      PopupPicker,
      Toast
    },
    methods:{
      onChange(val) {
        // console.log('val change', val);
        // console.log(val);
      },
      getinfor() {
        let that = this;
        let url = 'lblsapp-h5/v2/personCenter/memberInfoShow.json';
        util.ajax.post(url).then(function(stats){
          console.log(stats);
          that.cercompany = stats.data.res.data;
          that.names = stats.data.res.data.realName;
          let g = stats.data.res.data.sex;
          switch(g){
            case 'MALE':
              that.sex = ['男'];
              break;
            case 'FEMALE':
              that.sex = ['女'];
              break;
            case 'SECRECY':
              that.sex = ['保密'];
              break;
          };
          if(stats.data.res.data.facePhoto){
            that.headphoto = false;
          }else {
            that.headphoto = true;
          };
          if(stats.data.res.data.companyInfoFullName){
            that.occp = true;
          }
        }).catch(function(error){
          console.log(error);
        })
      },
      oBtn:function(){
        var that = this;
        let k = this.sex[0];
        let op = {
          sex: '',
          facePhoto: '',
          name: ''
        };
        switch (k) {
          case '男':
            op.sex = '1';
            break;
          case '女':
            op.sex = '0';
            break;
          case '保密':
            op.sex = '2';
            break;
        };
        op.name = this.names;
        let trl = 'lblsapp-h5/v2/personCenter/meberInfoUpdate.json';
        console.log(op);
        util.ajax.post(trl,op).then(function(stats){
          if(stats.data.code == '0'){
            that.message = '保存成功';
            that.showPositionValue = true;
          } else {
            that.message = '保存失败';
            that.showPositionValue = true;
          };
        }).catch(function(error){
          that.message = '保存失败';
          that.showPositionValue = true;
          console.log(error);
        });
      },
    },
    created() {
      if (window.navigator.userAgent.indexOf('LBLSIOS') > -1) {
        this.headIos = true;
      }
      this.getinfor();
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .user_info_list {
    margin-top: 46px
  }
  .side-fixd-ios {
    margin-top: 66px;
  }
  .user_info_img{
    width: 42px;
    height: 42px;
  }
  .user_info_name{
    background: rgba(255,255,255,0);
    text-align: right;
    height: 44px;
    font-size: 1.4rem;
    border: none;
    outline: none;
  }
  .user_info_names{
    height: 20px
  }
  .user_info_work{
    padding: 10px;
    font-size: 1.4rem;
    color: #808080;
  }
  .user_info_make{
    /* margin-top: 1px */
  }
  .weui-cell_select .weui-select{
    padding-right: 0px !important
  }
  .weui-select{
    background: #fff !important
  }
</style>
